<template>
  <div class="skuDetail" >
    <h3 class="title">基础资料</h3>
    <div class="detail-wrapper" v-if="detail.skuNo">
      <el-row :gutter="30">
        <el-col :span="7">SKU编号：{{detail.skuNo}}</el-col>
        <el-col :span="7">商品编号：{{detail.goodsNo}}</el-col>
      </el-row>
      <el-row :gutter="30">
        <el-col :span="7">商品名称：{{detail.goodsName}}</el-col>
        <el-col :span="7">商品类别：{{detail.goodKindFirst}}{{detail.goodsKindSecond}}</el-col>
        <el-col :span="7">原料：{{detail.rawDesc}}</el-col>
      </el-row>
      <el-row :gutter="30">
        <el-col :span="7">酿造工艺：{{detail.makeTechnology}}</el-col>
        <el-col :span="7">窖藏条件：{{detail.depotCondition}}</el-col>
        <el-col :span="7">产地：{{detail.productPlace}}</el-col>
      </el-row>
      <el-row :gutter="30">
        <el-col :span="7">生产标准：{{detail.productStandard}}</el-col>
        <el-col :span="7">生产许可：{{detail.productPermit}}</el-col>
        <el-col :span="7">香型：{{detail.odorType}}</el-col>
      </el-row>
      <el-row :gutter="30">
        <el-col :span="7">净含量：{{detail.netContent}}</el-col>
        <el-col :span="7">单位：{{detail.unit}}</el-col>
        <el-col :span="7">酒精度：{{detail.alocohl}}</el-col>
      </el-row>
      <el-row>
        <el-button size="medium" @click="$router.go(-1)">返回</el-button>
      </el-row>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      detail: {}
    };
  },
  mounted() {
    this.getDetail();
  },
  methods: {
    async getDetail() {
      try {
        let { data } = await this.$post({
          api: "/show/skuinfo",
          data: {
            skuNo: this.$route.query.id
          }
        });
        if (data.code === 0) {
          this.detail = data.data[0];
        } else {
          this.$message({
            type: "error",
            message: data.msg
          });
        }
      } catch (e){
        this.$message({
          type: "error",
          message: "接口报错"
        });
      }
    }
  }
};
</script>

<style lang="scss" scoped>
.title {
  line-height: 70px;
  font-size: 18px;
  padding-left: 30px;
  border-bottom: 1px solid #eeeeee;
}

.detail-wrapper {
  padding: 15px 30px;
}

.el-row {
  margin: 30px;
  &:last-child {
    margin: 60px 0 0 0px;
  }
}
</style>